// 粒子插件
window.onload = function () {
  //配置
  var config = {
    vx: 5, //小球x轴速度,正为右，负为左
    vy: 5, //小球y轴速度
    height: 2, //小球高宽，其实为正方形，所以不宜太大
    width: 2,
    count: 200, //点个数
    color: "200,193,193", //点颜色
    stroke: "0,0,0", //线条颜色
    dist: 6000, //点吸附距离
    e_dist: 20000, //鼠标吸附加速距离
    max_conn: 10, //点到点最大连接数
  };

  //调用
  CanvasParticle(config);
};
// 切换激活
// $a(".price-list>li").forEach(function (v) {
//   v.addEventListener("click", function () {
//     $a(".price-list>li").forEach(function (dom) {
//       dom.classList.remove("active");
//     });
//     v.classList.add("active");
//   });
// });

let data = [
  { count: 4000, price: 1200, unitPrice: "0.3000" },
  { count: 8000, price: 2000, unitPrice: "0.2500" },
  { count: 40000, price: 8000, unitPrice: "0.2000" },
];
let apiStr = "";
data.forEach(function (v, index) {
  apiStr += `
  <b data-price='${v.price}' data-unit-price='${v.unitPrice}' class="${
    index === 0 ? "active" : ""
  }">${v.count}</b>
  `;
});
$(".frequency").innerHTML = apiStr;

$(".frequency").addEventListener("click", function (ev) {
  if (ev.target.nodeName === "B") {
    [...$(".frequency").children].forEach(function (dom) {
      dom.classList.remove("active");
    });
    ev.target.classList.add("active");

    $(".price").textContent = ev.target.dataset.price;
    $(".price2").textContent = ev.target.dataset.unitPrice;
  }
});

// 选项卡
$a(".tabs-list>li").forEach(function (v, index) {
  v.addEventListener("click", function () {
    $a(".tabs-list>li").forEach(function (dom, i) {
      dom.classList.remove("active");
      $a(".tab-left>div")[i].classList.remove("on");
    });
    v.classList.add("active");
    $a(".tab-left>div")[index].classList.add("on");
  });
  console.log($(".frequency"));
});
